Unverankerte Aktionsschaltfläche hinzufügen

Schreiben Sie jetzt
Jetpack Compose ist das empfohlene UI-Toolkit für Android. Weitere Informationen zum Hinzufügen von Komponenten in Compose

Eine unverankerte Aktionsschaltfläche (UAS) ist eine runde Schaltfläche, die die primäre Aktion in der Benutzeroberfläche Ihrer App. Auf dieser Seite erfahren Sie, wie Sie die UAS Ihrem Layout hinzufügen, einige Anpassungen vornehmen und auf das Antippen von Tasten reagieren.

Weitere Informationen zum Entwerfen einer schwebenden Aktionsschaltfläche in Ihrer App gemäß den Material Design-Richtlinien finden Sie unter Schaltflächen: Unverankerte Aktionsschaltfläche.

Abbildung 1. Eine unverankerte Aktionsschaltfläche

Unverankerte Aktionsschaltfläche zum Layout hinzufügen

Im folgenden Code wird gezeigt, wie die FloatingActionButton in Ihrer Layoutdatei aussehen sollte:

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:src="@drawable/ic_my_icon"
        android:contentDescription="@string/submit"
        android:layout_margin="16dp" />

Standardmäßig wird die UAS durch das Attribut colorAccent dargestellt. die Sie anpassen können, mit der Farbpalette des Designs.

Du kannst andere FAB-Properties mit XML konfigurieren oder entsprechende Methoden wie die folgenden verwenden:

  • Die Größe der UAS mit dem Attribut app:fabSize oder der setSize()-Methode.
  • Die Farbe der Wellenbewegung des FAB mit dem Attribut app:rippleColor oder der Methode setRippleColor()
  • Das UAS-Symbol mit dem Attribut android:src oder dem setImageDrawable()-Methode.

Auf Tastentippen reagieren

Anschließend können Sie eine View.OnClickListener anwenden, um das Tippen auf das Floating Action-Button zu verarbeiten. Im folgenden Code wird beispielsweise ein Snackbar angezeigt, wenn der Nutzer auf die FAB tippt:

Kotlin

val fab: View = findViewById(R.id.fab)
fab.setOnClickListener { view ->
    Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
            .setAction("Action", null)
            .show()
}

Java

FloatingActionButton fab = findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
                .setAction("Action", null).show();
    }
});

Weitere Informationen zu den Funktionen der UAS finden Sie in der API-Referenz zu FloatingActionButton.